<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="dict" uri="http://www.jiyinit.com/dictTag" %>
<%@ taglib prefix="auth" uri="http://www.jiyinit.com/authTag" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
    <%@include file="/common/common.jsp" %>
    <link rel="stylesheet" href="${basePath}/css/layerPage.css${VERSION}"/>
    <link rel="stylesheet" href="${basePath}/assets/css/datepicker.css${VERSION}"/>
</head>


<body>

<div class="right-container">
    <br><br><br>
    <form id="form" name="form" class="form-horizontal" method="post" action="${basePath}/userSalary/parseWorkers"
          enctype="multipart/form-data">

        <div class="col-sm-12 form-group">
            <span id="workerInfoExcelSpan" class="col-sm-3">
                <input class="id-input-file-2" type="file" name="wordersFile" id="wordersFile">
            </span>
            <span id="excelModelDownload" class="col-sm-9 text-left">
                <a class="btn btn-primary" href="common/export_user_salary_model.xlsx"><i class="fa fa-download"></i>&nbsp;下载工资条excel模板</a>
                <button id="parseExcelBtn" type="button" class="btn btn-danger">提交解析Excel</button>
            </span>
            <span id="exportFileInfo"></span>
        </div>
        <div class="col-sm-12 form-group" id="loading"  style="display: none" >
            <br>
            正在上传···<br>
            <img src="${basePath}/img/loading.gif"/>
        </div>
        <div>
            <br><br><br><br><br>
            <ul style="list-style-type:none" >
                    <h4><li align="left"><span style="color: blueviolet">Excel模板使用注意事项:</span></li></h4>
                        <h5>&nbsp;</h5>
                        <h5><li align="left"><span style="color: blueviolet">&nbsp;&nbsp;&nbsp;&nbsp;1. 姓名、身份证号、工资月份为必填项;</span></li></h5>
                        <h5><li align="left"><span style="color: blueviolet">&nbsp;&nbsp;&nbsp;&nbsp;2. 请确保身份证号准确无误，且身份证号X必须大写;</span></li></h5>
                        <h5><li align="left"><span style="color: blueviolet">&nbsp;&nbsp;&nbsp;&nbsp;3. 请勿随意改动模板,如调整列的顺序或删除增加列,会导致数据错误;</span></li></h5>
                        <h5><li align="left"><span style="color: blueviolet">&nbsp;&nbsp;&nbsp;&nbsp;4. 请勿随意修改单元格格式.</span></li></h5>
            </ul>
        </div>
    </form>
</div>
<script src="${basePath}/js/common/jquery.form.js"></script>
<script src="${basePath}/plugins/jqGrid/jquery.jqGrid.min.js${VERSION}"></script>
<script src="${basePath}/plugins/jqGrid/grid.locale-cn.js${VERSION}"></script>
<script src="${basePath}/assets/js/ace-elements.min.js${VERSION}"></script>
<script src="${basePath}/js/common/jquery.validator.addmethod.js${VERSION}"></script>


<script>
    jQuery(function ($) {

        $('#wordersFile').change(function(){
            $('#submitBtn').attr('disabled', true);
        })

        $(document).ajaxStart(function(){
            $('#loading').show();
        }).ajaxStop(function(){
            $('#loading').hide();
        })

        $('#parseExcelBtn').click("click", function () {
            var wordersFile = $("#wordersFile").val();
            if (!wordersFile) {
                layer.alert("请选择要上传的文件")
                return false;
            }

            layer.confirm('是否确认导入文件数据？', {icon: 3}, function (index) {
                layer.close(index);
                $("#form").attr("action", "${basePath}/userSalary/parseWorkers.json")
                $("#form").ajaxSubmit({
                    dataType: "json",
                    beforeSubmit: function(){
                        var wordersFile = $("#wordersFile").val();

                        if (!wordersFile) {
                            layer.alert("请选择要上传的文件")
                            return false;
                        }
                    },
                    success: function(data){
                        if (data.status == '0') {
                            layer.alert(data.data, {
                                icon: 0,
                                skin: 'layui-layer-lan',
                                closeBtn: 0
                            });
                        }
                        else if(data.status == '1'){
                            layer.alert(data.message, {
                                icon: 0,
                                skin: 'layui-layer-lan',
                                closeBtn: 0
                            });
                        }
                        else {
                            layer.alert("系统未知错误", {
                                icon: 0,
                                skin: 'layui-layer-lan',
                                closeBtn: 0
                            });
                        }
                    },
                    error:function(data){
                        layer.alert("上传失败", {
                            icon: 0,
                            skin: 'layui-layer-lan',
                            closeBtn: 0
                        });
                    }
                });
            });
        });
    })
</script>

</body>
</html>